<template>
	<view class="login" :style="'height: 100vh'">
		<view class="upDon">
			<image src="@/static/img/logo/u6.png" alt="" srcset="" class="logo"></image>
			<view class="title">
				用餐缴费系统
			</view>
			<view class="yuan">
				<p>您好，</p>
				<p style="padding-top: 20rpx;">欢迎登录用餐缴费系统</p>
			</view>
			<!-- <view class="bolangline">
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
				<view class="mountain"></view>
			</view>  -->
		</view>
		<view class="flex showdom">
			<u-button v-if="!checked" class="dous" style="z-index: 99;" :custom-style="customStyle" shape="circle"
				@click="shouquan">一键登录</u-button>
			<u-button class="dous" :custom-style="customStyle" shape="circle" open-type="getPhoneNumber"
				v-if="phoneShow" @getphonenumber="getPhoneNumber">一键登录</u-button>
			<u-button class="dous" :custom-style="customStyle" shape="circle" v-else @click="phoenLogin">一键登录</u-button>


			<!-- 取消登录 -->
			<view class="mgt-30" style="text-align: center;">
				<u-button class="dousNo" :custom-style="customStyleNo" shape="circle" @click="goBack">取消登录</u-button>
			</view>

			<!-- 用户协议 -->
			<view class="mgt-30 sacn" style="text-align: center;">
				<u-checkbox id="check" active-color="#2567ff" shape="circle" @change="checkboxChange"
					v-model="item.checked" v-for="(item, index) in list" :key="index">
					<label for="check" class="checkdom">
						<view>
							我已阅读并同意
						</view>
						<view style="color: #2567ff; display: flex;">
							<view  @click.stop="toAgreement(9)">《用户服务协议/</view>
							<view  @click.stop="toAgreement(8)">隐私协议》</view>
						</view>
						<!-- <text></text> -->
					</label>
				</u-checkbox>
			</view>
		</view>
		<!-- <view class="floating-btn" :style="[{ bottom: '320rpx', right: '10rpx' }]" @click="goBack">
			<image src="@/static/img/sy.png" alt="" srcset="" class="bingohome" />
		</view> -->
	</view>
</template>

<script>
import {
	weixinCrypt,
	getClient,
} from "@/api/login.js";
import {
	getUserByPhone,
} from '@/api/meal/home.js'
import { commonLogin } from '@/api/login.js'
import userLogin from "@/api/userLogin.js";
// import {
// 	setSubscribeMessage
// } from '@/utils/WxEmpower.js'

export default {
	data() {
		return {
			user: uni.getStorageSync("user"),
			statusBarHeight: this.globalData.statusBarHeight, // 状态栏高度
			navigationBarHeight: this.globalData.navigationBarHeight, //导航栏高度
			navHeight: this.globalData.navHeight, //总体高度
			customStyle: {
				marginTop: '40px',
				color: '#ffffff',
				fontSize: '34rpx',
				height: '88rpx',
				width: '570rpx',
				//渐变
				background: 'linear-gradient(180deg, #70bafc 0%, #2567ff 100%)',
				fontWeight: '500'
			},
			customStyleNo: {
				marginTop: '40px',
				color: '#2567ff',
				fontSize: '32rpx',
				height: '80rpx',
				width: '570rpx',
				background: '#ffffff',
				border: '1rpx solid #2567ff',
			},
			phone: '',
			// 是否走手机号验证组件
			phoneShow: true,
			logo: "",
			originPage: null,
			options: '',
			openid: '',
			list: [{
				name: '同意用户服务协议和隐私协议',
				checked: false,
				disabled: false
			}],
			checked: false,
			settings: require('@/settings.js'),
		}
	},
	async onLoad() {
		// 获取上个页面路径
		let pages = getCurrentPages(); // 获取当前页面栈
		if (pages.length > 1) {
			let previousPage = pages[pages.length - 2]; // 获取上个页面信息对象
			let previousPagePath = previousPage.route; // 获取上个页面路径
			let previousPageOptions = previousPage.options; // 获取上个页面加载参数
			this.originPage = previousPagePath
			this.options = previousPageOptions
			console.log("上个页面", previousPage); // 输出上个页面路径
		} else {
			console.log("没有上个页面"); // 若只有一个页面则无法获取上个页面路径
		}
		if (this.user.phone) {
			this.phoneShow = false
			return
		}
		await this.handleUserLogin();
	},
	onShow() { },
	methods: {
		//看协议
		toAgreement(e) {
			let params = {
				id: e
			}
			uni.navigateTo({ url: '/pages/mall/protocol/protocol' + this.$u.queryParams(params) })
		},
		//勾选
		shouquan() {
			if (!this.list[0].checked) {
				// 在检查条件不满足时立即返回，防止后续代码执行
				uni.showToast({
					title: '请同意用户服务协议和隐私协议',
					icon: 'none',
					duration: 2000
				});
				return; // 立即退出函数，确保后续代码不会被执行
			}
		},
		// 小程序获取 session_key openid
		async handleUserLogin() {
			try {
				const res = await userLogin(true);
				if (res.data.code === 200) {
					console.log('res用户信息212', res.data);
					const item = JSON.parse(res.data.data)
					this.openid = item.openid
					uni.setStorageSync('session_key', item.session_key);
					uni.setStorageSync('openid', item.openid);
					console.log('用户信息', res.data);
					if (res.data.user.phone) { //存在电话号码
						this.phoneShow = false
						

						let user = res.data.user
						//通过电话号码获取我们系统的用户信息
						getUserByPhone(user.phone).then((res) => {
							if (res.data.code == 200) {
								console.log('当前用户信息', res.data.data);
								// 整合用户信息
								const systemUserInfo = res.data.data || {};
								// 合并用户信息，优先使用系统用户信息，如果为空则使用微信用户信息
								const mergedUser = {
									...user,  // 先放微信的用户信息作为基础
									...Object.fromEntries(  // 然后用系统用户信息覆盖，但要过滤掉空值
										Object.entries(systemUserInfo).filter(([_, value]) => 
											value !== null && value !== undefined && value !== ''
										)
									)
								};
								// 保存合并后的用户信息
								uni.setStorageSync('user', mergedUser);
							}
						})
					}else{
						// 如果微信用户信息没有电话号码，则使用微信用户信息
						uni.setStorageSync('user', res.data.user)
					}
				}
			} catch (error) {
				console.error(error);
			}
		},
		checkboxChange(e) {
			console.log(e, this.list[0]);
			this.checked = e.value
		},
		// 已注册会员手机号直接登录
		async phoenLogin() {
			console.log('权益勾选2', this.list[0].checked);
			if (!this.list[0].checked) {
				uni.showToast({
					title: '请同意用户服务协议和隐私协议',
					icon: 'none',
					duration: 2000
				});
				return;
			}
			// this.subscribeMessage()  订阅功能权限
			let user = uni.getStorageSync('user')
			// var that = this
			// setSubscribeMessage([
			//     'Qo-IvK1uAu8wAN6-mTsub9-LDr2zlE_hq8sCskzE2xE',
			//     'NU9VFkGtoVmzkXE4yu83ZMvy9hcxYJu3vMh-mjZ1dF8'
			// ]).then(msg => { // 获取订阅消息
			//     // 校验微信用户信息
			//     that.handleUserProfile(user);
			//     // 返回原来的页面
			//     that.phoenLoginHandle()
			// }).catch(msg => {
			//     // 校验微信用户信息
			//     that.handleUserProfile(user);
			//     // 返回原来的页面
			//     that.phoenLoginHandle()
			// })

			// 校验微信用户信息
			this.handleUserProfile(user);
			// 返回原来的页面
			this.phoenLoginHandle()
		},
		phoenLoginHandle() {
			// 判断是否为 tabBar 页面
			if (this.originPage) {
				console.log('this.originPage', this.originPage);
				if (this.originPage.startsWith("pages/tabBar")) {
					uni.switchTab({
						url: `/${this.originPage}`
					});
				} else {
					uni.redirectTo({
						url: `/${this.originPage}` + this.$u.queryParams(this.options)
					});
				}
			} else {
				uni.reLaunch({
					url: "/pages/tabBar/home/home"
				});
			}
		},
		// 手机号登录获取信息
		async getPhoneNumber({ detail }) {
			console.log('权益勾选1', this.list[0].checked);

			if (!this.list[0].checked) {
				uni.showToast({
					title: '请同意用户服务协议和隐私协议',
					icon: 'none',
					duration: 2000
				});
				return;
			}

			// 微信授权登录
			console.log('detail', detail);
			const openid = uni.getStorageSync('openid');
			const res = await weixinCrypt({
				encryptedData: detail.encryptedData,
				ivStr: detail.iv,
				openid: openid,
				sessionKey: uni.getStorageSync('session_key')
			});

			// var that = this
			if (res.data.code === 200) {
				// setSubscribeMessage([
				//     'Qo-IvK1uAu8wAN6-mTsub9-LDr2zlE_hq8sCskzE2xE',
				//     'NU9VFkGtoVmzkXE4yu83ZMvy9hcxYJu3vMh-mjZ1dF8'
				// ]).then(msg => { // 获取订阅消息
				//     that.loginSuccess(res, openid)
				// }).catch(msg => {
				//     that.loginSuccess(res, openid)
				// })
				this.loginSuccess(res, openid)
			} else {

				
				uni.reLaunch({
					url: "/pages/tabBar/home/home"
				});
			}
		},
		// 登录成功后处理
		async loginSuccess(res, openid) {
			const phoneRes = await commonLogin('phone', {
				phone: res.data.data,
				openid: openid
			});
			if (phoneRes.data.code === 200) {
				const user = phoneRes.data.data;
				console.log('获取到的用户信息', user);
				uni.setStorageSync("user", user);
				console.log('上个页面', this.originPage);
				// 返回原来的页面
				if (this.originPage) {
					if (this.originPage.startsWith("pages/tabBar")) {
						uni.switchTab({
							url: `/${this.originPage}`
						});
					} else {
						uni.redirectTo({
							url: `/${this.originPage}` + this.$u.queryParams(this.options)
						});
					}
				} else {
					uni.reLaunch({
						url: "/pages/tabBar/home/home"
					});
				}
			}
		},
		// 授权
		async handleUserProfile(user) {
			console.log('走这个方法了吗', user);

			// try {
			// console.log('走这个方法了吗2');

			// await uni.showModal({
			// 	title: '提示',
			// 	content: '是否授权用户信息',
			// });

			// console.log('走这个方法了吗3');
			// await uni.openPrivacyContract();
			// const profileRes = await uni.getUserProfile({
			// 	desc: "请授权用户信息",
			// });
			// console.log('走这个方法了吗4');
			// const data = profileRes.rawData;
			// console.log('获取的用户授权信息', data);

			// const params = {
			// 	id: user.id,
			// 	headPic: data.avatarUrl,
			// 	nickName: data.nickName,
			// 	phone: user.phone
			// };
			// const updateRes = await updateUserInfo(params);
			// if (updateRes.data.code === 200) {
			// 	const userInfoRes = await getUserInfo({
			// 		id: user.id
			// 	});
			// 	if (userInfoRes.data.code === 200) {
			// 		uni.setStorageSync('user', userInfoRes.data.data);
			// 	} else {
			// 		uni.showToast({
			// 			title: "更新用户信息失败",
			// 			icon: "none",
			// 			duration: 2000
			// 		});
			// 	}
			// }
			// } catch (error) {
			// 	console.error(error);
			// }
		},
		goBack() {
			//点击取消登录按钮后，清除用户信息
			uni.removeStorageSync('user')
			uni.reLaunch({
				url: '/pages/tabBar/home/home'
			})
		},
		// 微信通知
		// async subscribeMessage() {
		//     console.log('获取用户授权订阅');
		//     let that = this
		//     uni.getSetting({
		//         withSubscriptions: true,
		//         success(alwaysRes) {
		//             console.log('alwaysRes', alwaysRes);
		//             if (!alwaysRes.subscriptionsSetting.mainSwitch) {
		//                 //后台封禁了
		//                 //引导用户打开权限
		//                 uni.showModal({
		//                     title: '是否重新授权消息订阅功能',
		//                     success(res) {
		//                         if (res.confirm) {
		//                             uni.openSetting({
		//                                 success(res) {
		//                                     if (res.subscriptionsSetting) {
		//                                         Toast('开启权限成功')
		//                                         // that.takeNumber()
		//                                     }
		//                                 },
		//                                 fail() {
		//                                     Toast('开启权限失败')
		//                                     // that.takeNumber()
		//                                 },
		//                             })
		//                         } else if (res.cancel) {
		//                             Toast('拒绝开启开启权限')
		//                         }
		//                     },
		//                 })
		//             } else {
		//                 //后台未封禁 是检测订阅消息中是否有始终保持不再通知的选项
		//                 //alwaysRes.subscriptionsSetting.itemSettings != null 
		//                 uni.requestSubscribeMessage({
		//                     tmplIds: ['FlUWmVK8zKPx34SW81gGKB7zQxZR4YKeSFtkDiPQ-a8'],
		//                     success(res) {
		//                         // 消息订阅调起成功'accept''reject''ban'代表用户对此条订阅是同意、拒绝、后台禁用
		//                         // uni.showToast({
		//                         //     title: "订阅成功",
		//                         //     icon: "none"
		//                         // })
		//                     },
		//                     fail(err) {
		//                         //消息订阅调起失败
		//                         console.log('错误信息', err);
		//                     },
		//                     complete(e) {
		//                         console.log('完成执行', e);
		//                         // 无论确定还是取消，只要点击按钮后都会执行
		//                     },
		//                 })
		//             }
		//         },
		//     })
		// },
	},
};
</script>
<style lang="scss" scoped>
@import "@/static/scss/flex.scss";

.login {
	width: 100vw;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.upDon {
	height: 50vh;
	background-color: #ffffff;
	// padding-top: 100rpx;
	// background: linear-gradient(180deg, #2567ff 0%, #70bafc 100%);

	position: relative;

	.logo {
		position: absolute;
		width: 100%;
		height: 100%;
		z-index: 1;
	}

}

.bolangline {
	width: 100%;
	height: 100rpx;
	position: absolute;
	bottom: 0;
	display: flex;
	justify-content: space-around;
	align-items: flex-end;
	overflow: hidden;
}

.mountain {
	width: 30rpx;
	background: rgba(255, 255, 255, 0.8);
	border-radius: 60rpx 60rpx 0 0;
	margin: 0 -20rpx;
}

.mountain:nth-child(2n) {
	height: 60rpx;
	background: rgba(255, 255, 255, 0.6);
}

.mountain:nth-child(3n) {
	height: 40rpx;
	background: rgba(255, 255, 255, 0.4);
}

.mountain:nth-child(4n) {
	height: 70rpx;
	background: rgba(255, 255, 255, 0.7);
}

.sacn {
	position: fixed;
	width: 100%;
	text-align: center;
	top: 80vh
}

.dous {
	position: fixed;
	top: 53vh;
	left: calc(50vw - 275rpx);
}

.dousNo {
	position: fixed;
	top: 62vh;
	left: calc(50vw - 275rpx);
}

::v-deep .u-checkbox__label {
	margin-right: 0 !important;
}

.showdom {
	width: 100%;
	flex-direction: column;
	height: 50vh;
}

.yuan {
	width: 100vw;
	font-size: 44rpx;
	color: #ffffff;
	font-weight: 500;
	padding: 60rpx 60rpx;
	z-index: 2;
	position: absolute;
	top: 240rpx;
	left: 50%;
	transform: translateX(-50%);

	image {
		width: 384rpx;
		height: 80rpx;
	}

	.textP {
		font-size: 30rpx;
		color: #666666;
		letter-spacing: 33rpx;
		text-align: center;
		padding-left: 34rpx;
		margin-top: 10rpx;
	}
}


.title {
	text-align: center;
	font-size: 32rpx;
	color: #ffffff;
	font-weight: 600;
	z-index: 2;
	position: absolute;
	top: 100rpx;
	left: 50%;
	transform: translateX(-50%);
}

.u-checkbox__label {
	color: white !important;
}

.u-checkbox__icon-wrap {
	width: 30rpx !important;
	height: 30rpx !important;
	border: 1px solid #909090 !important;
}

.checkdom {
	display: flex;
	color: #999999;
}

// 悬浮按钮
.floating-btn {
	position: fixed;
	width: 95rpx;
	height: 95rpx;
	background-color: #ffffff;
	border-radius: 50%;
	text-align: center;
	cursor: pointer;
	padding: 10rpx;
	box-shadow: 0px 0px 15px #bbb7b7;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;

	.bingohome {
		height: 90rpx;
		width: 80rpx;
	}
}
</style>